<!DOCTYPE html>
<html lang="en">
<head>
    <script type="text/javascript" src="/flower/resources/js/jquery-1.11.0.min.js"></script>

    <script type="text/javascript" src="/flower/resources/js/jquery.json-2.2.min.js"></script>
    <meta charset="UTF-8">
    <title>flowerSolution</title>
</head>
<body>


<div style="margin: auto;">
    <div style="margin-left: 20px;margin-top:30px;margin-bottom:20px;font-size: xx-large;color: #2eaf56">阿花的问题之：随即组成大猜想</div>
    <div style="margin: 10px;border: 1px solid #eeeeee;height: 300px">
        <div style="margin: 10px; border: 1px solid #1ba157; width: 32%;height: 280px;float: left">
            <div style="margin-top: 15px;margin-bottom: 10px">
                <span style="font-size: large">你把excel的数据直接粘贴在这,逗号分隔哦</span>
            </div>
            <div style="margin-top: 30px">
                <textarea name="atom" id="atom" rows="8" style="width: 95%"></textarea>
            </div>
        </div>
        <div style="margin: 10px; border: 1px solid #1ba157; width: 32%;height: 280px;float: left">
            <div style="margin-top: 15px;margin-bottom: 10px">
                <span style="font-size: large">把统计的结果粘贴在这</span>
            </div>
            <div style="margin-top: 30px">
                <input name="molecule" id="molecule" style="width: 150px;height: 26px;"/>
            </div>
        </div>
        <div style="margin: 10px; border: 1px solid #1ba157; width: 32%;height: 280px;float: left">
            <div style="margin-top: 15px;margin-bottom: 10px">
                <span style="font-size: large">点击确定，查看可能的组合<span><a href="javascript:void(0)" id="getResult" onclick="getResult()" style="width: 100px;height: 50px;text-decoration:none;margin-left: 10px;background-color: #ff5876;border: 1px solid #eeeeee;border-radius: 5px;color: #fff2f2;">&nbsp;确&nbsp;定&nbsp;</a> </span></span>
            </div>
            <div style="margin-top: 30px">
                <span id="result" style="width: 95%"></span>
            </div>
        </div>
    </div>
</div>
</body>

<script type="text/javascript">
    function getResult() {
        console.log($("#atom").val())
        $.ajax({
            type: "POST",
            url: "getAtomResult" ,
            data: {"atom": $("#atom").val(),
                "molecule": $("#molecule").val()
            },
            dataType: "json",
            cache: false,
            success: function (result) {
                $("#result").text(result.responseText);
            },
            error:function (result) {
                $("#result").text(result.responseText);
            }
        });

    }
</script>
</html>